import { createRouter, createWebHashHistory } from "vue-router";

import { ElMessage } from "element-plus";

const routes = [
  {
    path: "/",
    component: () => import("@/views/layout/index.vue"),
    redirect: "/buycar",
    children: [
      // { to: "/", title: "首页" },
      // { to: "/buycar", title: "我要买车" },
      // { to: "/sellcar", title: "我要卖车" },
      // { to: "/forum", title: "论坛" },
      // { to: "/userinfo", title: "我的信息" },

      // {
      //   path: "/index",
      //   name: "home_index",
      //   component: () => import("@/views/index.vue"),
      //   meta: {
      //     windowListener: true,
      //   },
      // },

      // 买车
      {
        path: "/buycar",
        name: "buycar",
        component: () => import("@/views/buycar/index.vue"),
        meta: {
          windowListener: true,
          isPublic: true,
        },
      },

      // 卖车
      {
        path: "/sellcar",
        name: "sellcar",
        component: () => import("@/views/sellcar/index.vue"),
      },

      // 论坛
      {
        path: "/forum",
        name: "forum",
        component: () => import("@/views/forum/index.vue"),
        meta: {
          windowListener: true,
          isPublic: true,
        },
      },

      // 个人中心
      {
        path: "/userinfo",
        name: "userinfo",
        component: () => import("@/views/userinfo/index.vue"),
        redirect: "/userinfo/info",
        children: [
          {
            path: "info",
            name: "用户信息",
            icon: "el-icon-user-solid",
            component: () => import("@/views/userinfo/MyInfo.vue"),
          },
          {
            path: "collect",
            name: "我的收藏",
            icon: "el-icon-star-on",
            component: () => import("@/views/userinfo/MyCollect.vue"),
          },
          {
            path: "connect",
            name: "我的预约",
            icon: "el-icon-star-on",
            component: () => import("@/views/userinfo/MyConnect.vue"),
          },
          {
            path: "shop",
            name: "我的店铺",
            icon: "el-icon-s-shop",
            component: () => import("@/views/userinfo/MyShop.vue"),
          },
          {
            path: "car",
            name: "我的车辆",
            icon: "el-icon-s-help",
            component: () => import("@/views/userinfo/MyCar.vue"),
          },
          {
            path: "article",
            name: "我的帖子",
            icon: "el-icon-document",
            component: () => import("@/views/userinfo/MyArticle.vue"),
          },
          {
            path: "setting",
            name: "用户设置",
            icon: "el-icon-s-tools",
            component: () => import("@/views/userinfo/MySetting.vue"),
          },
        ],
      },

      // 车辆详情
      {
        path: "/detail/car/:id",
        props: true,
        component: () => import("@/views/buycar/CarDetail.vue"),
        meta: {
          isPublic: true,
        },
      },
      // 店铺详情
      {
        path: "/detail/shop/:id",
        props: true,
        component: () => import("@/views/buycar/ShopDetail.vue"),
        meta: {
          isPublic: true,
        },
      },
    ],
  },
  {
    path: "/login",
    component: () => import("@/views/login.vue"),
    meta: {
      isPublic: true,
    },
  },
  {
    path: "/register",
    component: () => import("@/views/register.vue"),
    meta: {
      isPublic: true,
    },
  },
];

const router = createRouter({
  history: createWebHashHistory(),
  routes,
});

router.beforeEach((to, from, next) => {
  if (to.meta.isPublic) {
    next();
  } else {
    // 验证用户是否登录
    if (sessionStorage.userId) {
      next();
    } else {
      ElMessage.error("您还未登录，请登录");
    }
  }
});

export default router;
